<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <!--
        测试JQuery的变量冲突情况。jQuery.noConflict();或者$.noConflict();都只是消除JQuery对$的控制，而jQuery依旧可用。
        -->
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>test - jQuery</title>
        <script src="../script/jquery-1.9.1.js" type="text/javascript"></script>
        <style type="text/css">
            div {
                border: thin #ccc solid;
                padding: 5px;
                margin: 5px;
            }
            .alink {
                text-decoration: none;
                display: inline-block;
                background-color: #F1F1F1;
                border: thin #ccc solid;
                padding: 3px;
                color: #333;
            }
        </style>
        <script>
            /*
             var q = jQuery.noConflict();
             jQuery(document).ready(function(){
             });
             */
            $.extend({
                test : function() {
                    alert("测试扩展！" + this.test2);
                },
                test2 : "test2'property!"
            });
            $(function() {
                /* 3.1.2代码
                 var tb = $("<table id='tb'><tr><td>这是一个新的单元格。/td></tr></table>");
                 $("#div4").empty().append(tb).css({"color":"blue","font-weight":"bold"});
                 $("#tb").css("border","2px #69c solid");
                 */

                /*
                 $("div").mouseover(function() {
                 var origin = $(this).html();
                 $(this).html("鼠标滑过了！").mouseout(function(){
                 $(this).html(origin);
                 });
                 });
                 */

                /* $(":input").bind("click",function(){
                 if($(this).val()=="show"){
                 $("div").fadeIn(1000);
                 }else if($(this).val()== "hidden"){
                 $("div").fadeOut(1000);
                 }
                 });
                 */

                $("#div1").load("../remote.txt");
                $.get('../remote.txt', function(data) {
                    $("#div2").html(data);
                });
                $.post('../remote.txt',function(data) {
                	alert(data);
                    $("#div3").html(data);
                    
                });
                $.ajax({
                    url : '../remote.txt',
                    success : function(data) {
                        $("#div4").html(data);
                    }
                });

                //$.test();
            });
        </script>
    </head>
    <body>

        <h2 align="center">BaseDemo Page</h2>
        <br />
        <!--
        <input type="button" value="show" />
        <input type="button" value="hidden" />
        <br /><br />-->
        <div id="div1" class="first-div">
            ID为div1,class为first-div
        </div>
        <div id="div2" class="first-div">
            ID为div2,class为first-div
        </div>
        <div id="div3" class="second-div">
            ID为div3,class为third-div
        </div>
        <div id="div4" class="second-div">
            ID为div4,class为second-div
        </div>
        <br />

        <!--
        <div>
        <a href="#1111#"></a> &nbsp;&nbsp;&nbsp;<a href="#"></a>
        </div>-->

    </body>
</html>
